<!DOCTYPE html>
<html>
<head>
	<title>Ajax Form Demo</title>
</head>
<body>
<h1>Ajax Form Demo</h1>
<form name="form1" action="ajaxdemo.php" method="get" accept-charset="utf-8">
	
	<h2>HTMLInputeElement</h2>
	<h3>text</h3>
	<p> <input type="text" name="text"></p>
	<h3>password</h3>
	<p> <input type="password" name="password"></p>
	<h3>checkbox</h3>
	<p><input name="checkbox[]" type="checkbox"  checked value="checkbox1"/>checkbox1</p>
	<p><input name="checkbox[]" type="checkbox"  checked value="checkbox2"/>checkbox2</p>
	<h3>radio</h3>
	<p><input name="radio" type="radio" value="radio1">radio1</p>
	<p><input name="radio" type="radio" value="radio2">radio2</p>	
	
	<h2>HTMLSelectElement</h2>
	<p><select name="select1">
		<option value="1">option1</option>
		<option value="2">option2</option>
	</select></p>
	
	<p><select name="select2[]" multiple="multiple" size=3>
		<option value="1">option1</option>
		<option value="2">option2</option>
		<option value="3">option3</option>
	</select></p>	
	
	
	
	<h2>HTMLTextAreaElement</h2>
	<p><textarea name="textarea1"></textarea></p>
	
	<h2>Other Element</h2>
	<p><input type="image"></p>
	<p><input type="file"></p>
	
	<p><input name="id" type="hidden" value="2"></p> <!-- id : 2 -->
	
	<p><input type="submit" value="Continue" /></p>
	
	<input type="button" value="Ajax sumbit" onclick="ajaxSumbit();"/>
</form>

<script type="text/javascript" src="../../../src/base.js"></script>
<script>
san.config.host="http://localhost/san/src/";
function ajaxSumbit(){

    san.def("test.ajax.form", function(){
    
        var Ajax = san.require("net.Ajax");
        
        Ajax.ajax({
            url: 'ajaxdemo.php',
            method: 'POST',
            data: {
                'id': '1'
            },
            form: 'form1',
            async: true, //默认所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false。注意，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。
            cache: false,
            timeout: 100,
            //dataType:xml json text(html) 
            success: function(response, xhr, opts){
                console.log("ajax response:", response);
            },
            error: function(xhr, opts){
                console.log('server-side failure with status code ' + xhr.status);
            }
        });

        
    }, "net.Ajax");
    
}
		
	
	
</script>

</body>
</html>